@import "./common";
@import "../packages/mdc-theme/color-palette";
@import "../packages/mdc-tab-scroller/mdc-tab-scroller";

.demo-scroller {
  width: 360px;
  outline: 1px solid $material-color-grey-400;
}

.demo-cube {
  width: 43px;
  height: 43px;
  margin: 10px;
}

@for $i from 1 through 34 {
  .demo-cube:nth-child(#{$i}) {
    background-color: rgb(10 + random(230), 10 + random(230), 10 + random(230));
  }
}

.demo-controller {
  padding: 10px 0;
}

.demo-controller-row {
  padding: 5px 0;
}
